<template>
  <div class="post-management">
    <el-table :data="postList" style="width: 100%">
      <el-table-column label="帖子标题">
        <template #default="{row}">
          <router-link :to="`/post/${row.id}`">{{ row.title }}</router-link>
        </template>
      </el-table-column>
      <el-table-column label="状态" width="120">
        <template #default="{row}">
          <el-tag :type="statusTag(row.status)">
            {{ row.status | formatStatus }}
          </el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="views" label="浏览" width="80"></el-table-column>
      <el-table-column prop="likes" label="点赞" width="80"></el-table-column>
      <el-table-column prop="comments" label="评论" width="80"></el-table-column>
      <el-table-column label="操作" width="150">
        <template #default="{row}">
          <el-button size="mini" @click="editPost(row)">编辑</el-button>
          <el-button size="mini" type="danger" @click="deletePost(row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>

    <el-pagination
        class="mt-20"
        background
        layout="prev, pager, next"
        :total="totalPosts"
        :page-size="10">
    </el-pagination>
  </div>
</template>

<script>
export default {
  data() {
    return {
      postList: [
        { id: 1, title: '猫咪日常护理指南', status: 'published',
          views: 256, likes: 45, comments: 12 },
        { id: 2, title: '狗狗疫苗全攻略', status: 'audit',
          views: 128, likes: 23, comments: 5 }
      ],
      totalPosts: 35
    }
  },
  methods: {
    // 保持原有方法
  },
  filters: {
    formatStatus(status) {
      const map = { published: '已发布', audit: '审核中' }
      return map[status] || '未知状态'
    }
  }
}
</script>